/*
PALETA DE COLORES

medio verdosos
rgb(116,198,204),
rgb(10,160,153 ),

azules
rgb(56,168,224),
rgb(30,113,184),
rgb(23,53,83),

morados
rgb(105,53,128),
rgb(97,92,152),
*/

@font-face {
  font-family:  BrandonGrotesque1;
  src: url('fuentes/HVD Fonts - BrandonGrotesque-Regular.otf');
}


@font-face {
  font-family:  BrandonGrotesque2;
  src: url('fuentes/HVD Fonts - BrandonGrotesque-Medium.otf');
}

@font-face {
  font-family:  BrandonGrotesqueLight;
  src: url('fuentes/HVD Fonts - BrandonGrotesque-Light.otf');
}



@media screen and (max-width: 768px) and (orientation: portrait){


#celularesLandscape{display: none; height: 1px; overflow: hidden;}
#escritorio{display: none; height: 1px; overflow: hidden;}



.superMenu{
  /*transform: scaleX(1.65) translateY(-2%);*/
  box-shadow: cyan -1px 2px 2px;
  opacity: .85;
  position: absolute;
  top:18%;
  left: 20%;
    width: 60%;
}

.opciones ul{
  list-style: none; /* Remove list bullets */
  padding: 0;
  margin: 0;
}

.opciones ul li{
 font-size: 1.85rem;
    line-height: 1.85;
    color: white;
    font-family: BrandonGrotesque1;
    background-color: rgba(105,53,128,.95);
    border: solid 1px rgb(10,160,153 );
        text-align: center;
}

.opciones ul li:nth-child(1){background-color: black; font-size: 2.5rem}

.opciones ul li:hover{ font-family: BrandonGrotesque2; font-size: 2.5rem;
    line-height: 2;
    background-color: rgb(10,160,153 );
  }

#cerrar{background-color: black;
    color: rgba(116,198,204);
    border-radius: 100%;
}



#celularesPortrait{padding: 5px}

.grid-container {
  display: grid;
  grid-template-columns: 24% 48% 24%;
 grid-column-gap: 2%;
grid-row-gap: 2px;}



.item1 {grid-column-start: 1;
  		grid-column-end: 2;
  		background-image: url("css/imagenes/logoJAG.png");
		background-repeat: no-repeat;
		background-size: contain;
		background-position-y: center;
		padding: 2%;
}
	

.item2 {background-image: url("svg/logo.svg");
		background-repeat: no-repeat;
		background-position: center; 
		 background-size: contain;
		 grid-column-start: 2;
  		grid-column-end: 3;
  		padding: .05%;

				} 

.item3 {grid-column-start: 3;
  		grid-column-end: 4;
  		background-image: url("svg/UAQ morado.svg");
  		background-repeat: no-repeat;
		background-position: center; 
		background-size: contain;
		padding: 2%;}

.item4{grid-column-start: 1;
  		grid-column-end: 2;
  		background-color: rgb(97,92,152);}

    .contacto{ background-image: url("svg/mapas-y-ubicacion-blanco.svg");
    background-size: contain; 
      display: block;
      width: 30px;
      height: 100%;
      margin: auto;
      background-repeat: no-repeat;}

.item5{grid-column-start: 2;
  		grid-column-end: 3;
  		background-color: rgb(97,92,152);
    transition-timing-function: ease-in-out;
    transition-duration: 1s;
    z-index: 999 !important
  }

	.glyphicon-menu-hamburger{
		left: 50%;
		top:25%!important;
		color:rgb(116,198,204);
	}


.item6{grid-column-start: 3;
  		grid-column-end: 4;
  		background-color: rgb(97,92,152);}


.face{ background-image: url("svg/facebook.svg");
    background-size: contain; 
      display: block;
      width: 30px;
      height: 100%;
      margin: auto;
      background-repeat: no-repeat;}

.item7{grid-column-start: 1;
  		grid-column-end: 4;
  		background-color: rgb(116,198,204);}



.item8{grid-column-start: 1;
      grid-column-end: 4;}



  .item8 .actividades  h3{font-size: 2.5vh;
      font-family: "BrandonGrotesque2";
        text-align: center;
        margin-top: 5px!important}

  

.actividades , .actividades2{
    padding-top: .1375rem!important;
    padding-right: .1375rem!important;
    padding-left: .1375rem!important;
}

#cuadro1{background-color: rgb(56,168,224); color:rgb(105,53,128); width: 100%; padding: 2px; background-image: url("svg/analisis.svg"); background-size: 33%; background-position: center; background-repeat: no-repeat;}
#cuadro2{background-color: rgb(30,113,184); color:rgb(255,255,255); width: 100%; padding: 2px; background-image: url("svg/qualitative-research.svg"); background-size: 33%; background-position: center; background-repeat: no-repeat; }
#cuadro3{background-color: rgb(23,53,83); color:rgb(116,198,204); width: 100%; padding: 2px; background-image: url("svg/aula.svg"); background-size: 33%; background-position: center; background-repeat: no-repeat; }

}


/*actividad2_2

actividad3_2
*/




@media screen and (max-width: 1024px) and (orientation: landscape){
  #celularesPortrait{display: none; height: 1px; overflow: hidden;}
  #escritorio{display: none; height: 1px; overflow: hidden;}

.menuLateral{background-color: rgb(97,92,152);margin:2px 0px 2px 0px; transition-duration: 1s; transition-timing-function: ease-in-out;}
.header{background-color: white; 
      padding-right: 1px!important;
      padding-left: 1px!important;
        padding-top: 2px;
                padding-bottom: 2px;
}


.nave{background-color: rgb(97,92,152);}

.FCPS1{ 
    background-image: url("imagenes/logoJAG.png");
  background-repeat: no-repeat;
    background-position: center; 
     background-size: contain;
     grid-column-start: 2;
      grid-column-end: 3;
      padding: .05%;
      height:  100%;
      padding-right: 5px!important;
      padding-left: 5px!important;}

.logoLusc{background-image: url("svg/logo.svg");
    background-repeat: no-repeat;
    background-position: center; 
     background-size: contain;
     grid-column-start: 2;
      grid-column-end: 3;
      padding: .05%;
      height:  100%;
      padding-right: 5px!important;
      padding-left: 5px!important;
    };
 
 .textoLusc{padding-right: 2px!important;
      padding-left: 2px!important;}

.logoUAQ{ 
  background-image: url("svg/UAQ morado2.svg");
  background-repeat: no-repeat;
    background-position: center; 
     background-size: contain;
     grid-column-start: 2;
      grid-column-end: 3;
      padding: .05%;
      height:  100%;
      padding-right: 5px!important;
      padding-left: 5px!important;}

.titulo{margin: 2%;
    font-family: BrandonGrotesque2;
    font-size: 1.65rem;
    text-align: center;
    color:rgb(97,92,152);}

.textoLusc{padding-right: 1px!important;
      padding-left: 1px!important;}


.granContenedor2{background-color: rgb(116,198,204);
    margin:2px 0px 2px 0px; 
    transition-duration: 1s;
    transition-timing-function: ease-in-out;}


.quehacemos{padding-right: 2px!important;
      padding-left: 2px!important;z-index: 10; transition-duration: 1s;
    transition-timing-function: ease-in-out;}
 #cuadro1_2{height:100%!important;
  background-color: rgb(56,168,224); 
  color:rgb(105,53,128);
   width: 100%;
    padding: 2px; 
    background-image: url("svg/analisis.svg");
     background-size: 33%; 
 background-position: center;
  background-repeat: no-repeat;}
 #cuadro2_2{height:100%!important; background-color: rgb(30,113,184); color:rgb(255,255,255); width: 100%; padding: 2px; background-image: url("svg/qualitative-research.svg"); background-size: 33%; background-position: center; background-repeat: no-repeat; }
 #cuadro3_2{height:100%!important; background-color: rgb(23,53,83); color:rgb(116,198,204); width: 100%; padding: 2px; background-image: url("svg/aula.svg"); background-size: 33%; background-position: center; background-repeat: no-repeat; }

.actividades2{
    padding-top: .05375rem!important;
    padding-right: .05375rem!important;
    padding-left: .051375rem!important;
    margin-top: .85%;
    margin-bottom: .85%;
}
.actividades2  h3{
  font-size: 1.35rem;
      font-family: "BrandonGrotesque2";
        text-align: center;
        margin-top: 5px!important}


#opcion1{background-image: url("svg/boton-de-retroceso-blanco.svg");
         background-size: contain; 
      display: block;
      width: 30px;
      height: 100%;
      margin: auto;
      background-repeat: no-repeat;
      background-position: center;
      transform: rotate(180deg);
    transition-duration: 1s;
    transition-timing-function: ease-in-out;
  right: 25%;}

#opcion2{
  background-image: url( "svg/facebook.svg");
    background-size: contain; 
      display: block;
      width: 30px;
      height: 100%;
      margin: auto;
      background-repeat: no-repeat;
      background-position: center;transition-duration: 1s;
    transition-timing-function: ease-in-out;
  right: 25%;}

}

@media screen and (max-width: 1024px) and (orientation: landscape){
#opcion3{
    background-image: url("svg/mapas-y-ubicacion-blanco.svg");
    background-size: contain; 
    display: block;
    width: 30px;
    height: 100%;
    margin: auto;
    background-repeat: no-repeat;
    background-position: center;
    transition-duration: 1s;
    transition-timing-function: ease-in-out;
    right: 25%}


#cuadro1_2:hover {transform: scale(1.25); z-index: 100}
#cuadro2_2:hover {transform: scale(1.25); z-index: 100}
#cuadro3_2:hover{transform: scale(1.25); z-index: 100}
#opcion2:hover{transform: scale(1.25); z-index: 100}
#opcion3:hover{transform: scale(1.25); z-index: 100}
#cuadro2_2:hover #cuadro3_2 {opacity: .7;  transform: scale(.8)!important}
#cuadro2_2:hover #cuadro1_2 {opacity: .7;  transform: scale(.8)!important}


.opciones2 ul{
  list-style: none; /* Remove list bullets */
  padding: 0;
  margin: 0;
  transition-duration: 1s;
  transition-timing-function: ease-in-out;
}

.opciones2 ul li{
 font-size: 1.35rem;
    line-height: 1.25;
    color: white;
    font-family: BrandonGrotesque1;
    border-bottom:  solid 1px rgb(10,160,153 );
    text-align: left;
    padding-right: 1px!important; 
    padding-left: 1px!important;
    margin-bottom: 5px;
}


.opciones2 ul li:hover{ font-family: BrandonGrotesque2; font-size: 1.5rem;
  text-align: right!important;
      line-height: 2;
    background-color: rgb(10,160,153 );
  }

.aquiVaElMenu{padding-right: 5px!important;
    padding-left: 5px!important;
   transition-duration: 1s;
    transition-timing-function: ease-in-out;}

}








@media screen and (min-width: 1024px){
  #celularesPortrait{display: none; height: 1px; overflow: hidden;}
  #celularesLandscape{display: none; height: 1px; overflow: hidden;}
  #escritorio{display: block; background-image: url("imagenes/fcpsLAT.png"); background-repeat: no-repeat;background-position-x: 100%;
    background-position-y: 100%;background-size: 10%;}

  .contenedor{
        margin-top: 5px;
    margin-bottom: 1px;
    display: grid;
  grid-template-columns: 3% 2fr 6fr 1fr  1fr 3%;
  grid-column-gap: 2%;
grid-row-gap: 2px;
}



.item9{
  grid-column-start: 1;
  grid-column-end:2;}

.item10{
  grid-column-start: 2;
  grid-column-end:3;
  background-image: url("svg/logo.svg");
    background-repeat: no-repeat;
    background-position: center; 
     background-size: contain;
     grid-column-start: 2;
      grid-column-end: 3;
      padding: .05%;
      height:  100%;
      padding-right: 5px!important;
      padding-left: 5px!important;
    
}


.item11{
  grid-column-start: 3;
  grid-column-end:4;
}

.titulo2{margin: 4%;
    font-family: BrandonGrotesqueLight;
    font-size: 2.15rem;
        text-align: center;
    color:rgb(97,92,152)}

.textoLusc2{padding-right: 1px!important;
      padding-left: 1px!important;}

.item12{
  grid-column-start: 4;
  grid-column-end:5;
      background-image: url("imagenes/logoJAG.png");
  background-repeat: no-repeat;
    background-position: center; 
     background-size: contain;
      padding: .05%;
      height:  100%;
      padding-right: 5px!important;
      padding-left: 5px!important;
}

.item13{
  grid-column-start: 5;
  grid-column-end:6;
      background-image: url("svg/UAQ morado.svg");
  background-repeat: no-repeat;
    background-position: center; 
     background-size: contain;
      padding: .05%;
      height:  100%;
      padding-right: 5px!important;
      padding-left: 5px!important;
}

.item14{grid-column-start: 2;
  grid-column-end:6;
  background-image: linear-gradient(to right, rgb(116,198,204),rgb(10,160,153 ), rgb(56,168,224),rgb(30,113,184),rgb(23,53,83),rgb(105,53,128),rgb(97,92,152));
  height: 20%;
  border-radius: 39%;

  }

.contenido{
        margin-top: 0px;
            margin-bottom: 0px;
    display: grid;
  grid-template-columns: 3% 16% 6fr 2fr 3%;
  grid-template-rows: : 90% 10%;
  grid-column-gap: 1%;
grid-row-gap: 1px;
}

.item15{
  margin-top: 10px;
  grid-column-start: 2;
    grid-column-end: 3;
    grid-row-start: 1;
    grid-row-end: 3;
  
}
.menuLateral2{background-color: rgb(97,92,152)}
.granContenedor3{grid-column-start: 3;
  grid-column-end:4;
  background-color: rgb(116,198,204);
    }



 .queHacemos2{
  grid-column-start: 3;
  grid-column-end:4;
  display: inline-grid;
  grid-template-columns: repeat(3,1fr);
 }


 #cuadro1_3{grid-column-start: 1;  grid-column-end:2;height:90%!important; background-color: rgb(56,168,224); color:rgb(105,53,128); margin:auto;width: 98%; padding: 2px; background-image: url("svg/analisis.svg"); background-size: 20%; background-position: right; background-repeat: no-repeat;}
 #cuadro2_3{grid-column-start: 2;  grid-column-end:3;height:90%!important; background-color: rgb(30,113,184); color:rgb(255,255,255); margin:auto;width: 98%; padding: 2px; background-image: url("svg/qualitative-research.svg"); background-size: 20%; background-position: right; background-repeat: no-repeat; }
 #cuadro3_3{grid-column-start: 3;  grid-column-end:4;height:90%!important; background-color: rgb(23,53,83); color:rgb(116,198,204); margin:auto;width: 98%; padding: 2px; background-image: url("svg/aula.svg"); background-size: 20%; background-position: right; background-repeat: no-repeat; }

.s_h3{font-size: 1.5rem} 


.fb{grid-column-start: 4;
    grid-column-end: 5;
    grid-row-start: 1;
    grid-row-end: 3;}



.item18 div span  iframe{height: 33%;}


.opciones3 {padding: 5px;}
.opciones3 ul{
  list-style: none; /* Remove list bullets */
  padding: 0;
  margin: 0;
   transition-duration: 1s;
    transition-timing-function: ease-in-out;
}

.opciones3 ul li{
 font-size: 2rem;
    line-height: 1.5;
    color: white;
    font-family: BrandonGrotesqueLight;
    /*background-color: rgba(105,53,128,.95);*/
    border-bottom:  solid 1px rgb(10,160,153 );
        text-align: left;
      padding-right: 1px!important; 
     padding-left: 1px!important;
     margin-bottom: 5px;
     transition-duration: .5s; 
     transition-timing-function: ease-in-out;
}


.opciones3 ul li:hover{ 
  font-family: BrandonGrotesque2; 
  text-transform: uppercase;
  font-size: 1.8rem;
  text-align: right!important;
      line-height: 1.6;
    background-color: rgb(10,160,153 );
  }

.opciones3 ul li:hover .icon2{display: none; background-image: url();}
.opciones3 ul li:hover .icon1{display: block; float: left;    width: 30px; 
    height: 30px;
    background-size: contain; background-position: center;}


#opcion_3{ background-image: url(svg/mapas-y-ubicacion-blanco.svg);
    background-size: contain;
    display: block;
    height: 100%;
    margin: auto;
    background-size: 25%;
    background-repeat: no-repeat;
    background-position: center;
    transition-duration: 1s;
    transition-timing-function: ease-in-out;
    }

.icon1{display: none; 
    }


.icon2{display: block; 
    float: right;
    width: 30px;
    height: 30px;
    background-size: contain}

|{text-align: center; color:white;}

}   



.visible{display: block}


iframe{width: 90%; margin:auto; height:  90%}
.iframe1{height:  50%}
.Contacto h3{font-size: 20px; color:rgb(116,198,204);}
.Contacto h4{ color:rgb(10,160,153);}
.Contacto h5{ color:rgb(56,168,224);}
.Contacto h6{ color:rgb(56,168,224);}


.Home{background-color: white; padding: 10px; overflow: hidden;max-width: 900px}
.Nosotros{background-color: white }
.Dashboard_Prensa{background-color: green; overflow: scroll; overflow-x: scroll;max-width: 1100px}
.Mapa_interactivo{background-color: blue}
.Eventos{background-color: pink}
.Noticias{background-color: yellow}
.Contacto{background-color: black}

.car{ max-width: 80%;
    margin: auto;
    left: 10%;
    display: block!important;
}}
.slick-slide   {z-index: 2!important; height: 90%; max-width: 90%!important}

/*.Dashboard_Prensa  .tableauPlaceholder{transform: scale(.9);}